<script setup lang="ts">
import { useLayoutState } from '../../basic-layout/context'

const { logo, layout, isMobile } = useLayoutState()
const cls = computed(() => ({
  'ant-pro-global-header-logo': layout.value === 'mix' || isMobile.value,
  'ant-pro-top-nav-header-logo': layout.value === 'top' && !isMobile.value,
}))
</script>

<template>
  <div
    :class="cls"
    style="
   color: #fff;
   font-size: 24px;
   "
  >
    <a
      c-primary
      style="
    display: flex;
    align-items: center;
    "
    >
      <img
        :src="logo"
        style="width: 40px;
        position: relative;
        height: 40px;
        top:0px;
        left:-0px;
         display: block;"
      >
      <span
        style="color: white;
        letter-spacing: 0.5px;
        font-size: 22px;
        font-weight: 600;
        margin-left: 10px;
        position: relative;
        left:-2px
        "
      >
        国际贸易金融6C考试报名系统
      </span>
    </a>
  </div>
</template>
